<script setup lang="ts">
import CommonConfig from "./CommonConfig.vue";
import { type FormDesignerComponents } from "../FormComponentMixin";
const config = defineModel<FormDesignerComponents>("config");
</script>

<template>
  <CommonConfig v-model:config="config" />
  <el-form-item label="提示文字">
    <el-input v-model="config.props.placeholder" placeholder="输入提示" />
  </el-form-item>
  <el-form-item label="隐藏名称">
    <el-switch v-model="config.props.hideLabel" />
  </el-form-item>
  <el-form-item label="是否必填">
    <el-switch v-model="config.props.required" />
  </el-form-item>
  <el-form-item label="默认行数">
    <el-input-number v-model="config.props.rows" placeholder="可输入默认行数" />
  </el-form-item>
  <el-form-item label="最大长度">
    <el-input-number v-model="config.props.maxlength" placeholder="可输入的最大长度" />
  </el-form-item>
  <el-form-item label="校验方法">
    <el-checkbox-group v-model="config.props.validate">
      <el-checkbox label="非空" value="required" />
      <el-checkbox label="手机号码" value="mobilephone" />
      <el-checkbox label="固定电话" value="phone" />
      <el-checkbox label="邮箱" value="email" />
      <el-checkbox label="身份证号" value="idcard" />
      <el-checkbox label="英文" value="english" />
      <el-checkbox label="中文" value="chinese" />
      <el-checkbox label="数字" value="number" />
      <el-checkbox label="网址" value="url" />
    </el-checkbox-group>
  </el-form-item>
</template>

<style lang="scss" scoped></style>
